<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<title>发送记录</title>
		<link rel="stylesheet" href="asserts/resource/css/common.css" />
		<link rel="stylesheet" href="asserts/resource/mui/css/mui.min.css" />
		<link rel="stylesheet" href="asserts/resource/css/css.css"/>


		<script type="text/javascript" src="asserts/resource/js/flexible_C.js" ></script>
		<script type="text/javascript" src="asserts/resource/js/jquery.min.js"></script>
		<script type="text/javascript" src="asserts/resource/mui/js/mui.min.js"></script>
	</head>
	<body>
	<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
		<div class="mui-scroll">
			<!--数据列表-->
			<ul id="cmd-container" class="mui-table-view mui-table-view-chevron">

			</ul>
		</div>
	</div>
	<div class="triggerwrap">
		<p class="switch"><i></i></p>
		<p class="refurbish"><i></i></p>
	</div>
	</body>
	<script type="text/javascript">
        var page = 0, //分页码
            pageSzie=9;//每页显示个数
        var sender=1;

        //阻尼系数
        var deceleration = mui.os.ios?0.003:0.0009;
        //滚动初始化
        mui('.mui-scroll-wrapper').scroll({
            scrollY: true, //是否竖向滚动
            scrollX: false, //是否横向滚动
            startX: 0, //初始化时滚动至x
            startY: 0, //初始化时滚动至y
            indicators: true, //是否显示滚动条
            deceleration:deceleration, //阻尼系数,系数越小滑动越灵敏
            bounce: true //是否启用回弹
        });
        mui.init({
            pullRefresh : {
                container:'#pullrefresh',//待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等
                up : {
                    height:50,//可选.默认50.触发上拉加载拖动距离
                    auto:true,//可选,默认false.自动上拉加载一次
                    contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
                    contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
                    callback : function() {
                        var self = this; // 这里的this == mui('#refreshContainer').pullRefresh()
                        // 加载更多的内容
                        page++;
                        getCmdRecord(sender,page,pageSzie,self);
                    }  //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
                }
            }
        });

		//获取命令信息记录  发送者标识1上行（用户发送）  0下行（终端发送）
		function getCmdRecord(sender,currentPage,pageSize,self) {
            $.ajax({
                //几个参数需要注意一下
                type: "POST",//方法类型
                async: true, // 使用异步方式
                dataType: "json",//预期服务器返回的数据类型
                url: "/cmdrecord/query" ,//url
                data: {"sender":sender,"currentPage":currentPage,"pageSize":pageSize},
                success: function (result) {
                    var recordHtml='';
                    var cmdData= result.data;
                    if (result.status == 1) {
                       var data=cmdData.data;
                       var dataCount=data.length;
                        if(dataCount>0){
                            $.each(data,function(index,value){
                                recordHtml+='<li class="cmd-item">';//class="mui-table-view-cell"
                                if(value.sender==1){
                                    recordHtml += "<div class='cmd-item-container'><p class='cast'>"+value.cmdMessage+"</p>" +
                                        "<p class='time'>发送时间："+value.terminalSendTime+"</p></div>";
                                    if(value.status==1){
                                        recordHtml +="<div class='cmd-item-container'><span class='success'>发送成功</span>";
                                    }else {
                                        recordHtml +="<div class='cmd-item-container'><span class='fail'>发送失败</span>";
                                    }
                                    recordHtml +="<p class='time'>回复时间："+value.terminalReplyTime+"</p></div>";
                                    if(value.status!=1){
                                        recordHtml +="<p class='error-msg'><span class='fail'>请检查设备电量或联系客服</span></p>"
                                    }
                                }else {
                                    recordHtml += "<p><span class='cast'>"+value.cmdMessage+"</span>" +
                                        "<p class='time'>发送时间：" +value.linkTerminalSendTime+"</p></div>";
                                    if(value.status==1){
                                        recordHtml +="<div class='container'><span class='success'>发送成功</span>"
                                    }else {
                                        recordHtml +="<div class='container'><span class='fail'>发送失败</span>"
                                    }
                                    recordHtml +="<p class='time'>回复时间："+value.linkTerminalReplyTime+"</p></div>";
                                    if(value.status!=1){
                                        recordHtml +="<p class='error-msg'><span class='fail'>请检查设备电量或联系客服</span></p>"
                                    }
                                }
                                recordHtml +="</li>";
                            });
                            self.endPullupToRefresh(false);
                        }else {
                            self.endPullupToRefresh(true);
						}
						$('#cmd-container').append(recordHtml);
                    }else{
                        mui.toast(result.msg,2)
                    }
                },
                error : function() {
                    mui.toast('网络异常!',2)
                }
            });
        }

        $(".switch").click(function(){
            if(sender==1){
                sender=0;
                document.title='上报记录';
			}else {
                sender=1;
                document.title='发送记录';
			}
            resetPullRedresh();
        })
		
		
        $(".refurbish").click(function(){
            resetPullRedresh();
        })

		//重置列表数据
		function resetPullRedresh() {
            page=0;
            $("#cmd-container").empty();
            mui('#pullrefresh').pullRefresh().pullupLoading();
            mui('#pullrefresh').pullRefresh().refresh(true);
        }

	</script>
</html>
